// .bgcImg {
//   width: 100%;
//   height: 100vh;
//   max-height: 1000px;
//   min-height: 600px;
//   background-image: url('/static/img/carousel/home_moon.jpg');
//   background-position: center top;
//   background-size: cover;

//   .content {
//     position: absolute;
//     top: 50%;
//     left: 50%;
//     transform: translate(-50%, -50%);
//     color: #fff;
//     line-height: normal;
//     .title {
//       h3 {
//         color: #fff;
//         margin-bottom: 35px;
//         font-size: 70px;
//         font-weight: 500;
//       }
//       span {
//         font-size: 20px;
//         color: #ff5151;
//       }
//     }
//   }
// }

.common {
  max-width: 1200px;
  margin: 0 auto;
  .comm_main {
    max-width: 1200px;
    margin: 0 auto;
    .comm_home {
      .content {
        margin: -55px 25px 0 25px;
        border-radius: 10px;
        background-color: rgb(255, 255, 255);

        .recommend,
        .allArticle {
          padding-top: 0.1px;
          .title {
            text-align: center;
            font-size: 30px;
            margin: 10px 0 15px;
          }
          .list {
            .articleItem {
              transform: scale(0);
              transition: transform 0.5s cubic-bezier(0.445, 0.05, 0.55, 0.95);
            }
            .articleItem:hover {
              transform: scale(1.05) !important;
            }
            :global(.ant-col) {
              position: relative;
              padding: 10px;
              // background-color: #ccc;
              background-position: center center;
              background-size: cover;
              background-color: #89f7fe;
              box-shadow: 0 15px 35px rgba(50, 50, 93, 0.1),
                0 5px 15px rgba(0, 0, 0, 0.07);
              margin-bottom: 25px;
              border-radius: 8px;
              height: 280px;
              text-align: center;
              .articleTitle {
                font-size: 30px;
                font-weight: 500;
                color: #fff;
                text-align: center;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
              }
              .articleType {
                font-size: 13px;
                color: #fff;
              }
              .articleSynopsis {
                margin-top: 15px;
                font-size: 16px;
                padding: 0 5px;
                height: 125px;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 4;
                overflow: hidden;
                color: #fff;
              }
              :global(.ant-btn) {
                position: absolute;
                bottom: 10px;
                left: 50%;
                transform: translateX(-50%);
                color: #fff;
              }
            }
          }
        }
      }
    }
  }
}

.btn:hover {
  transform: translate(-50%, -7%) !important;
}
